<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="vue.js" type="text/javascript"></script>
	</head>
	<body>
		<div id="app" align="center">
			<img id="light" src="img/off.gif">
			<h1 id="title">学习状态</h1>
			<button v-on:click="fun">请点击</button>
			
		</div>
		<script type="text/javascript">
			i = 0;
			var vue = new Vue({
				el: '#app',
				data: {
					t1: "img/off.gif",
					t2: "img/on.gif"
				},
				methods: {
					fun() {
						var light = document.getElementById('light');
						var msg = document.getElementById('title');
						if (i%2 == 1) {
							light.src = this.t1;
							msg.innerHTML = '大脑一片空白。';
							i++;
						} else {
							light.src = this.t2;
							msg.innerHTML = '有一个好点子！';
							i++;
						}
					}
				}
			});
		</script>
	</body>
</html>
